<div class="Home">
	<div class="banner">
		<img class="bgm" style="background-color: #CCCCCC;"/>
		<div class="nav">
			<div class="net-name">
				饰图网
			</div>
			<div class="portal" ui-sref="home">首&nbsp;&nbsp;页</div>
			<div class="portal" ng-show="false">分&nbsp;&nbsp;类</div>
			<div class="login" type="button" data-toggle="modal" data-target="#loginModal" ng-show="!isLogin">登&nbsp&nbsp陆</div>
			<div class="login user-area-nav" ng-show="isLogin">
				<div ng-show="normalUser">
					<img class="user-icon" ng-src="{{user.logo? imgRoot + 'usericons/' + user.id + '.jpg' : imgRoot + 'usericons/user.jpg'}}" />
					<span>{{user.name}}</span>
				</div>
				<div ng-show="!normalUser">
					<img class="user-icon" ng-src="{{qqUser.figureurl}}" />
					<span>{{qqUser.nickname}}</span>
				</div>
				<ul class="user-options ng-hide">
				<li ng-click="loginSucceed()">我的主页</li>
				<li ng-click="logOut()">退出</li>
			</ul>
			</div>
			
		</div>
		<div class="huge-title" ng-show="false">
			泼墨艺术，挥洒生活之美
		</div>
		<div class="search-area">
			<select class="" style="color: #FFFFFF; font-weight: bold;" ng-options="o as o.name for o in searchOpts" ng-model="curOpt" ng-change="optChange()">
			</select><input type="text" ng-model="query[pos]" placeholder="{{ph[pos]}}" style="text-align: left!important; color: #FFFFFF;font-weight: bold"/>			
			<div class="search-wrap">
				<i class="iconfont search">&#xe613;</i>
			</div>
			
		</div>
	</div>
	<div class="collapse upload-img-area" id="bgi" name="bmg">	
		<form method="post" enctype="multipart/form-data" id="add-bgi">
			<input id="_ef" type="file" style="visibility:hidden" name="image" accept="image/jpeg, image/jpg, image/gif, image/png">
		</form>
	</div>
	
	<div class="img-area container-fluid">
		<div class="row">
			<div class="tuku">
				<a name="here"></a>
				<a class="nav-text" ng-click="backToCollection()">图库列表</a><span style="font-size: 15px" ng-show="!collectionShow && !matchImgShow">&nbsp;>&nbsp;</span>
				<a class="nav-text" ng-show="!collectionShow && !matchImgShow">{{collectionName}}</a>
				<span style="font-size: 15px" ng-show="matchImgShow">&nbsp;>&nbsp;</span>
				<a class="nav-text" ng-show="matchImgShow">以图识图</a>
			</div>
			<!-- cover -->
			<div class="cover" ng-show="collectionShow && !matchImgShow">
				<div class="cover-area" ng-model="allCollections">
					<div class="img-pad" id="{{'cover' + $index}}" ng-repeat="c in collections|filter: query[pos]" ng-click="enterCollection(c.name, $index)">
						<div class="img-pad-nav" ng-show="false">
							<div style="float: left;">
								<button class="rbtn btn sm" ng-click="collectSet($event)" style="padding: 0px!important;">收藏</button>
							</div>
							<div style="float: right;">
								<i class="iconfont md unlike" ng-click="like($event, c.cname)" ng-show="false">&#xe6ca;</i>
							</div>
						</div>
						<div class="imgsm">
							<img id="{{'cover-img' + $index}}" ng-model="root" ng-src="{{rootMin + c.cname + '/' + c.cover}}" />
						</div>
						<div class="text-area">
							<div class="left">{{c.cname}}</div>
						</div>
					</div>
				</div>
				<pagination data="{{allCollections}}"  view="collections"></pagination>
			</div>
			
			<!-- image -->
			<div class="img-detail" ng-show="!collectionShow && !matchImgShow" ng-model="allImgs">
				<div class="pads-area">
					<div class="img-pad" id="{{'img' + $index}}" ng-repeat="img in imgs track by $index" ng-click="openImg(img)">
						<div class="img-pad-nav">
							<div style="float: left;">
								<button class="rbtn btn sm" ng-click="collectionImg($event, img)" style="padding: 0px!important;">收藏</button>
							</div>
							<div style="float: right;">
								<i class="iconfont md unlike" ng-click="like($event, img)" ng-show="false">&#xe6ca;</i>
							</div>
						</div>
						<div class="imgsm">
							<img id="{{'mono-img' + $index}}" ng-src="{{rootMin + collectionName + '/' + img}}" />
						</div>
						<div class="text-area">
							<div class="left">{{img}}</div>
						</div>
					</div>
				</div>
				<pagination data="{{allImgs}}" view="imgs"></pagination>
				
			</div>
			<!--Identify Images-->
			<div name="Match-img" class="img-detail" ng-show="matchImgShow" ng-model="matchedImgs">
				<div class="bgm">{{bgmText}}</div>
				<div class="tempImg-wrap">
					<div class="temp-search">
						<button class="btn rbtn upload-img-btn" ng-click="showFile()">以图识图</button>
						<span class="attention">请上传PNG、JPG格式得图片，大小不超过3MB, 使用无水印、光照均匀、正面图像搜索精度更高！</span>
						<button class="btn rbtn" ng-click="matchImg()" ng-show="false">搜索</button>
					</div>
					<div class="tempImg" ng-show="isUpload">
						<img id="temp-img"/>
					</div>
				</div>
				<div class="pads-area">
					<div class="img-pad" ng-repeat="img in viewImgs track by $index" ng-click="openImg(img.imgurl, curOpt.mode)">
						<div class="img-pad-nav">
							<div style="float: left;">
								<button class="rbtn btn sm" ng-click="collectionImg($event, img.imgurl)" style="padding: 0px!important;">收藏</button>
							</div>
							<div style="float: right;">
								<i class="iconfont md unlike" ng-click="like($event, img.imgurl)" ng-show="false">&#xe6ca;</i>
							</div>
						</div>
						<div class="imgsm">
							<img id="{{'mono-img' + $index}}" ng-src="{{rootMin + img.imgurl}}" />
						</div>
						<div class="text-area">
							<div class="left">{{img.name}}</div>
						</div>
					</div>
				</div>
				<div pagination data="{{matchedImgs}}" view="viewImgs"></div>
			</div>
		</div>
	</div>
</div>

<!-- Modal -->
<div class="modal fade" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="loginModal" data-backdrop="static" keyboard="false">
	<div class="modal-dialog" role="document">
		<div class="modal-content" style="width: 400px;margin: 0 auto;margin-top: 10%;">
			<div class="modal-header login-header">
				<span class="modal-title" id="myModalLabel">登录</span>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
			</div>
			<div class="modal-body login-body">
				<label for="user">账&nbsp&nbsp户：</label><input type="text" ng-model="username" id="user"/>
				<br /><br />
				<label for="pwd">密&nbsp&nbsp码：</label><input type="password" ng-model="password" id="pwd" />
			</div>
			<div class="modal-operation">
				<span id="qqLoginBtn"></span>
				<a class="register" ng-click="toRegisterModal()" ng-show="false">注册</a>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn rbtn" ng-click="login()" style="padding: 1px 12px!important;">登  录</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">取  消</button>
			</div>
		</div>
	</div>
</div>

<!-- Modal -->
<div class="modal fade" id="registerModal" tabindex="-1" role="dialog" aria-labelledby="registerModal" data-backdrop="static" keyboard="false">
	<div class="modal-dialog" role="document">
		<div class="modal-content" style="width: 400px;margin: 0 auto;margin-top: 10%;">
			<div class="modal-header login-header">
				<span class="modal-title" id="myModalLabel">注册</span>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
			</div>
			<div class="modal-body login-body">
				<label for="user">账&nbsp&nbsp户：</label><input type="text" ng-model="regUser" id="reg-user"/>
				<br /><br />
				<label for="pwd">密&nbsp&nbsp码：</label><input type="password" ng-model="regPwd" id="reg-pwd" />
			</div>
			<div class="modal-footer">
				<button type="button" class="btn rbtn" ng-click="register()">注册</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">取  消</button>
			</div>
		</div>
	</div>
</div>

<!-- Modal -->
<div class="modal fade" id="img-view" tabindex="-1" role="dialog" aria-labelledby="img-view">
	<div class="modal-dialog" role="document" style="width: 100%!important;margin: 0 auto;">
		<div class="modal-content" style="background-color: transparent !important;border: none!important;">
			<button class="modal-exit-btn" type="button" class="close close-btn" ng-click="exit('img-view')"><span aria-hidden="true">&times;</span></button>
			<div class="imgview-frame">
				<div class="left-frame">
					<div class="piece">
						<div class="tool-bar">
							<button class="rbtn btn" ng-click="collectBind(imgSrc, 1)">收藏</button>
							<button class="btn" ng-show="false">删除</button>
						</div>
						<div class="img">
							<img id="img-open" ng-src="{{root + collectionName + '/' + imgSrc}}" />
						</div>
					</div>
					<div class="piece">
						<div class="img-info">{{"图名：" + imgSrc}}</div>
					</div>
				</div>
				<div class="right-frame">
					<div class="piece">
						<div class="board-info">
							<a class="user-icon">
								<img ng-src="{{rootMin + collectionName + '/' + allCollections[coverIndex].cover}}" /><span>{{" 图集：" + collectionName}}</span>
							</a>
						</div>
						<div class="tinyImgsZone">
							<div class="tinyimg" ng-repeat="i in imgs" ng-click="toggleImg(i)">
								<img ng-src="{{rootMin + collectionName + '/' + i}}" />
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- Modal -->
<div class="modal fade" id="collect-view" tabindex="-1" role="dialog" aria-labelledby="collect-view">
	<div class="modal-dialog" role="document" style="width: 600px!important;margin: 0 auto;padding-top: 5%!important;">
		<div class="modal-content" style="height: 500px;background-color: #FFFFFF !important;border: none!important;">
			<button type="button" class="close" data-dismiss="modal" aria-label="Close" style="position: absolute;z-index: 2000;right: 20px;top: 10px;"><span aria-hidden="true">&times;</span></button>
			<div class="box-title">收藏</div>
			<div class="box-inner">
				<div class="preview">
					<div class="preimg">
						<img ng-src="{{root + collectionName + '/' + imgSrc}}" />
					</div>
				</div>
				<div class="right-part">
					<div class="board-list">
						<div class="searchSet">
							<input class="form-control" placeholder="搜索图集或创建图集" ng-model="set"/>
							<ul class="sets">
								<li class="ss" id="{{'s' + $index}}" ng-repeat="s in curSets | filter: set" ng-click="selectSet($index)">{{s.cname}}</li>
							</ul>
						</div>
					</div>
					<div class="add-collection" ng-show="set">
						<span ng-click="createCollection(set)" style="color: #8c8c8c;"><i class="iconfont">&#xe64e;</i>新建图集</span><span class="collection-name">{{" '" + set + "'"}}</span>
					</div>
					<button class="btn rbtn" ng-click="collectBind(imgSrc)">收藏</button>
				</div>
			</div>
		</div>
	</div>
</div>
<section ng-show="access" class="admin-css">
	<input class="form-control" ng-model="setName" placeholder="请输入单个图集名称" />
	<button class="btn rbtn" ng-show="true" ng-click="recordSet(setName)">录入图片</button>
</section>

<section ng-show="access" class="admin-css">
	<input class="form-control" ng-model="set" placeholder="请输入单个图集名称" />
	<button class="btn rbtn" ng-click="compress(set)">压缩图片</button>
</section>